//定义全局参数
var layer;
var $;
var element;
var util;
var laytpl;
var interFaceAddres;

//页面初始化
var initHtml = {
	//加载左侧菜单列表
	initLeftMenu: function() {
		//加载左侧菜单模版
		var getTpl = leftMen.innerHTML
		view = document.getElementById('e_leftMune');
		$.ajax('', {
			url: interFaceAddres.mainUrl,
			dataType: 'json', //服务器返回json格式数据
			type: 'get', //HTTP请求类型
			timeout: 10000, //超时时间设置为10秒；
			success: function(data) {
				laytpl(getTpl).render(data, function(html) {
					view.innerHTML = html;
				});

				//事件监听
				initEvent.leftMenuEvent();
				//渲染元素
				element.render();
			},
			error: function(xhr, type, errorThrown) {
				console.log(errorThrown)
			}
		});
	}
};
//事件操作
var initEvent = {
	//左侧菜单栏事件监听
	leftMenuEvent: function() {
		element.on('nav(leftMune)', function(elem) {
			console.log(elem); //得到当前点击的DOM对象
			var that = $(this);
			var url = that.attr("data-url");
			var title = that.attr("data-title");
			//判断是一级还是二级
			if (url) {
				//判断是否打开过
				if ($(".layui-tab-title li[lay-id]").length <= 0) {
					element.tabAdd('demo', {
						title: title,
						content: '<iframe data-frameid="' + 77 + '" scrolling="auto" frameborder="0" src="' + url +
							'" style="width:100%;height:99%;"></iframe>', //支持传入html			,
						id: url
					});
				} else {
					var isOpen = false;
					$.each($(".layui-tab-title li[lay-id]"), function() {
						//如果点击左侧菜单栏所传入的id 在右侧tab项中的lay-id属性可以找到，则说明该tab项已经打开
						if ($(this).attr("lay-id") == that.attr("data-url")) {
							isOpen = true;
						}
					})
					console.log(isOpen)
					if (isOpen) {
						element.tabChange('demo', url); //根据传入的id传入到指定的tab项
					} else {
						element.tabAdd('demo', {
							title: title,
							content: '<iframe data-frameid="' + 77 + '" scrolling="auto" frameborder="0" src="' + url +
								'" style="width:100%;height:99%;"></iframe>', //支持传入html			,
							id: url
						});
					}
				}


			} else {}
			//最后不管是否新增tab，最后都转到要打开的选项页面上
			element.tabChange('demo', url);
		});
	},

};
//模块化加载
layui.config({
	base: 'js/' //加载自定义模块
}).use(['layer', 'jquery', 'element', 'util', 'laytpl', 'interfaceModule'], function() {
	layer.msg('Hello World');
	//实例化参数
	layer = layui.layer;
	$ = layui.jquery;
	element = layui.element;
	util = layui.util;
	laytpl = layui.laytpl;
	interFaceAddres = layui.interfaceModule;
	element.tab({
		headerElem: '#e_tabHeader>li' //指定tab头元素项
			,
		bodyElem: '#e_tabBody>div' //指定tab主体元素项
	});
	//入口，相当于与jq的$.ready
	layer.ready(function() {
		//加载左侧菜单列表
		initHtml.initLeftMenu();

	});
	//渲染元素
	element.render();
});
